<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Bem Vindo</title>
  <link rel="stylesheet" href="/deposito/css/jquery-ui-1.10.3.custom.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  
   <script src="/deposito/js/jquery-ui-1.10.3.custom.js"></script>

  <style>
    body { font-size: 62.5%; }
    label, input { display:block; }
    input.text { margin-bottom:12px; width:95%; padding: .4em; }
    fieldset { padding:0; border:0; margin-top:25px; }
    h1 { font-size: 1.2em; margin: .6em 0; }
    div#users-contain { width: 350px; margin: 20px 0; }
    div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; }
    div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; }
    .ui-dialog .ui-state-error { padding: .3em; }
    .validateTips { border: 1px solid transparent; padding: 0.3em; }
  </style>
  <script>

  
  $(function() {
    var name = $( "#login" ),     
      password = $( "#password" ),
      allFields = $( [] ).add( name ).add( password ),
      tips = $( ".validateTips" );
 
    function updateTips( t ) {
      tips
        .text( t )
        .addClass( "ui-state-highlight" );
      setTimeout(function() {
        tips.removeClass( "ui-state-highlight", 1500 );
      }, 500 );
    }
 
    function checkLength( o, n, min, max ) {
      if ( o.val().length > max || o.val().length < min ) {
        o.addClass( "ui-state-error" );
        updateTips( "Informar " + n);
        return false;
      } else {
        return true;
      }
    }
 
    function checkRegexp( o, regexp, n ) {
      if ( !( regexp.test( o.val() ) ) ) {
        o.addClass( "ui-state-error" );
        updateTips( n );
        return false;
      } else {
        return true;
      }
    }

    $('#password').keypress( function(e){
	    if($("#senhaConfirma").length == 0){
	    	if (e.keyCode == 13) {
		  		$(".ui-dialog-buttonpane button:contains('Login')").click();
		  	  }
	    }
    });
	  	            	
    
 
    $( "#dialog" ).dialog({
    	 closeOnEscape: false,
    	 modal: true,
         open: function(event, ui) {
        	  $(this).closest('.ui-dialog').find('.ui-dialog-titlebar-close').hide();          
           },
           show: {
               effect: "blind",
               duration: 1000
             },
             hide: {
               effect: "explode",
               duration: 1000
             },           
      
      height: 260,
      width: 380,
      resizable: false,
      modal: true,
      buttons: {
        "Login": function() {
          
          var bValid = true;
          allFields.removeClass( "ui-state-error" );
 
          bValid = bValid && checkLength( name, "username", 3, 16 );
          bValid = bValid && checkLength( password, "password", 5, 16 );
 
          bValid = bValid && checkRegexp( name, /^[a-z]([0-9a-z_])+$/i, "Username may consist of a-z, 0-9, underscores, begin with a letter." );
          bValid = bValid && checkRegexp( password, /^([0-9a-zA-Z])+$/, "Password field only allow : a-z 0-9" );
 
          if ( bValid ) {
        	  //$ (this).dialog( "close" );
        	  
          	serializedData = $("#form").serialize();
          					$.ajax({
               		  		  type: "POST",
	    	            		  url:  "/deposito/LoginAction",
	    	            		  data: serializedData,
	    	            		  success: function(data) {
		    	            		  
		    	            		  if (data.indexOf("redirect=ok") > -1) {
	    	            				  $("form").append("<input type='hidden' name='redirect' value='1'/>");
	    	            				  $("form").submit();
		    	            		  } 
		    	            		  else {
			            				  updateTips(data);
			    	            	  }
	    	            		  }			    	            		 
          		});             
              
          }
        },
      },
      close: function() {
        allFields.val( "" ).removeClass( "ui-state-error" );
      }
    });


  });


  </script>

</head>
<body>

<div id="dialog" title="Login" >
  <form id= "form" action="/deposito/LoginAction" method="post">
  <fieldset>
    <label for="name">Nome</label>
    <input type="text" name="login" id="login" class="text ui-widget-content ui-corner-all" id="login"/>
     <label for="password">Senha</label>
     <input type="password" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" id="senha" />
     <p class="validateTips"></p>    
  </fieldset>
  </form>
</div>
  
</body>
</html>